<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>LESS Example</title>
    <link rel="stylesheet/less" type="text/css" href="./common.less" />
    <!-- <link rel="stylesheet" href="./common.css"> -->
    <script src="./less.min.js"></script>
  </head>
  <body>
    <button id="changeColor">Change Color</button>
    <script>
      let color = "red";
      document
        .getElementById("changeColor")
        .addEventListener("click", function () {
          less.modifyVars({
            "@bgColor": (color = color === "red" ? "black" : "red"),
          });
        });
    </script>
  </body>
</html>
